<template>
  <el-container>
    <el-aside width="240px">
      <el-menu
          class="el-menu-vertical-demo"
          background-color="#ffffff"
          text-color="#606266"
          active-text-color="#409EFF"
          :default-openeds='["UserInfoManage","CourseInfo"]'
      >
        <el-menu-item index="Index">
          <template slot="title">
            <i class="el-icon-s-home"></i>
            <span slot="title">首页</span>
          </template>
        </el-menu-item>
        <!--              动态菜单栏开发-->
        <el-submenu default-active="Index" :index="menu.name" v-for="menu in menuList">
          <template slot="title">
            <i :class="menu.icon"></i>
            <span>{{menu.title}}</span>
          </template>
          <router-link :to="item.path" v-for="item in menu.children">
            <el-menu-item :index="item.name">
              <template slot="title">
                <i :class="item.icon"></i>
                <span slot="title">{{item.title}}</span>
              </template>
            </el-menu-item>
          </router-link>
        </el-submenu>
      </el-menu>
    </el-aside>
    <el-container>
      <el-header style="height: 55px;">
        <strong style="font-size: 20px">复旦教务服务系统</strong>
        <div class="header-avatar">
          <!--              <el-avatar class="el-avatar"  size="medium" :src="userInfo.avatar"></el-avatar>-->
          <el-dropdown>
              <span class="el-dropdown-link" >
                {{userInfo.username}}<i class="el-icon-arrow-down el-icon--right"></i>
              </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item :underline="false">
                <router-link to="/student/userCenter">
                  个人中心
                </router-link>
              </el-dropdown-item>
              <el-dropdown-item @click.native="logout">
                <router-link to="/login">退出</router-link>
              </el-dropdown-item>
              <el-dropdown-item divided>设置</el-dropdown-item>
            </el-dropdown-menu>
            <router-link to="/login" style="margin-left: 8px; color: white">
              返回首页
            </router-link>
          </el-dropdown>
        </div>
      </el-header>
      <el-main>
        <!--        动态标签-->
        <!--                <Tabs></Tabs>-->
        <div style="margin: 0 15px">
          <router-view></router-view>
        </div>
      </el-main>
    </el-container>
  </el-container>

</template>

<script>
export default {
  name: "Teacher",
  data (){
    return {
      userInfo: {},
      menuList:[
        {
          name: 'UserInfoManage',
          title: '个人信息',
          icon: 'el-icon-user-solid',
          path: '',
          component: '',
          children: [
            {
              name: 'UserInfo',
              title: '查看/修改个人信息',
              icon: 'el-icon-view',
              path: '/teacher/userCenter',
              children: []
            },{
              name: 'EditUserInfo',
              title: '修改密码',
              icon: 'el-icon-edit',
              path: '/teacher/changePassWord',
              children: []
            },
          ]
        },
        {
          name: 'CourseInfo',
          title: '课程信息管理',
          icon: 'el-icon-s-data',
          path: '',
          component: '',
          children: [
            {
              name: 'Courses',
              title: '管理我的课程',
              icon: 'el-icon-s-claim',
              path: '/teacher/teaCourse',
              children: []
            },
            {
              name: 'CourseInfo',
              title: '我的课程信息',
              icon: 'el-icon-s-claim',
              path: '/teacher/teaCourseInfo',
              children: []
            },
          ]
        },
      ]
    }
  },
  created() {
    this.getUserInfo()
  },
  methods: {
    getUserInfo() {
      this.$axios.get("/sys/userInfo").then(res => {
        this.userInfo = res.data.data;
        console.log(res.data.data);
      })
    },
    logout() {
      this.$axios.post("/logout").then(res => {
        console.log(res.data.data)
        //退出要删除数据
        localStorage.clear()
        sessionStorage.clear()
        this.$store.commit("resetState")
        this.$router.push("/login")
      })
    }
  }
}
</script>

<style scoped>
  @import "Index.css";
</style>